import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import Axios from "axios";
import Api from "./api";
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

Vue.use(ElementUI);
Vue.prototype.$axios = Axios;
Vue.prototype.$api = Api;
Vue.config.productionTip = false;

// process是全局的，可以直接使用
if (process.env.NODE_ENV === 'development') { // 说明当前为开发环境
  // 开发环境相关特殊方法
  Axios.defaults.baseURL = process.env.VUE_APP_BASE_URL
  // baseUrl地址使用.env.development文件中的配置对象API_HOST，API_HOST名称不固定，根据你的定义的来
} else if (process.env.NODE_ENV === 'production') {
  // 生产环境相关特殊方法
  Axios.defaults.baseURL = process.env.VUE_APP_BASE_URL
  // baseUrl地址使用.env.production文件中的配置对象API_HOST，API_HOST名称不固定，根据你的定义的来
}

const vm = new Vue({
  router,
  store,
  render: h => h(App)
}).$mount("#app");

// 拦截Axios发起的所有请求，通过dispatch修改isLoading为true
Axios.interceptors.request.use(
  config => {
    vm.$store.dispatch('loadingStart'); // 显示loading组件
    return config;
  },
  err => {
    return Promise.reject(err);
  }
);
//拦截Axios发起的所有响应，通过dispatch修改isLoading为false
Axios.interceptors.response.use((config) => {
  vm.$store.dispatch('loadingEnd');
  return config;
});
